<template>
  <section>
    <el-checkbox-group v-model="checkedGoodsTypes" value-key="id" v-if="!mallGoods">
      <el-checkbox v-for="(type,i) in mallGoodsTypeList" :label="type.id" :key="type.id" @change="handleCheckGoodsTypesChange(type.id,i,$event)">{{type.name}}</el-checkbox>
    </el-checkbox-group>
  </section>
</template>

<script>
  import mallGoods from './mallGoods'
  import {mapGetters, mapActions, mapMutations} from 'vuex'
  import errHandler from '@/assets/errHandler.js'
  import Vue from 'vue'//后续添加属性，需要vue联动
  export default {
    name: "checkedGoodsType",
    components: {mallGoods},
    props:['value'],
    data() {
      return {
        selType:'',
        mallGoodsTypeList:null,
        checkedGoodsTypes:[],
        mallGoods:false,
      }
    },
    created(){
      console.log('———————————选商品类型处———————————————————')
      this.checkedGoodsTypes=this.value
      console.log(this.value)
      this.getMallGoodsTypeList()
    },
    watch:{
      value(nv,ov){
        console.log('商品类型处——watch——————',nv)
      }
    },
    computed:{
      ...mapGetters(['department']),
    },
    methods: {
      ...mapActions({
        fetch: 'fetch'
      }),
      getMallGoodsTypeList(){
        this.fetch({name:"getMallGoodsTypeList",data:{storeId:this.department.id}})
          .then(res=>{
            console.log(res)
            this.mallGoodsTypeList=res
          })
          .catch(err=>{
            console.log(err)
            errHandler.handle(this,err)
          })
      },
      handleCheckGoodsTypesChange(goodTypeId,index,e){
        if(e){
          this.value.push(goodTypeId)
        }else {
          this.value.splice(index,1)
        }
        console.log(this.value)
        console.log(this.checkedGoodsTypes)
        // this.fetch({name:"getMallGoodsList",data:{goodTypeId,departmentId:this.department.id}})
        //   .then(res=>{
        //     console.log(res)
        //     for(let i=0;i<res.content.length;i++){
        //       if(e){
        //         this.test.push(res.content[i].id)
        //       }else {
        //         console.log('否则里面',i)
        //         this.test.splice(this.test.findIndex(j=>j === res.content[i].id),1)
        //       }
        //     }
        //     console.log(this.test)
        //   })
        //   .catch(err=>{
        //     console.log(err)
        //     errHandler.handle(this,err)
        //   })
      },
      // confirmSelGoodsEvent(e){//单选goods里传来的
      //   console.log(e)
      // },
      // getMallGoodsList(goodTypeId){
      //   this.fetch({name:"getMallGoodsList",data:{goodTypeId,departmentId:this.department.id}})
      //     .then(res=>{
      //       console.log(res)
      //       for(let i=0;i<res.content.length;i++){
      //         this.test.push(res.content[i].id)
      //       }
      //       console.log(this.test)
      //     })
      //     .catch(err=>{
      //       console.log(err)
      //       errHandler.handle(this,err)
      //     })
      // }
    }
  }
</script>

<style scoped>

</style>
